<template>
	<div @click="handleToItem" :class="['good-li', isShop ? 'is-shop' : '']">
		<img class="good-li-img" :src="item.cover_url" alt="">
		<div class="good-info">
			<div class="good-info-name">
				{{ item.name }}
			</div>
			<div class="good-info-num">
				<div class="good-info-price">
					<div v-if="item.price > 0">¥{{ item.price }}</div>
					<div class="hd_box" v-if="item.price_integral > 0">
						<span v-if="item.price > 0">+</span>
						<div class="hd_text"><img src="../../../images/huaduo_icon.png" alt="">{{
							item.price_integral }}</div>
					</div>
				</div>
				<div class="good-info-sale" >销量{{ item.sales_count | saleWordFilter}}</div>
			</div>
			<!-- <div class="good-info-subsidy" v-if="item.labels.length">
				<div class="good-info-subsidy-btn" :style="{background:items.bg_color,color:items.color}" v-for="items,indexs in item.labels" :key="indexs">
					<img v-if="items.icon_type!=0" :src="items.icon_type==1?require('../../../images/xiaofei.png'):require('../../../images/huaduo.png')" alt="">{{ items.name }}</div>
			</div> -->
			<!-- <div v-if="!isShop" @click.stop="handleToShop(item)" class="good-info-shop">
				<div class="good-info-shop-btn">
					<img class="good-info-shop-icon" :src="shopGoodIcon" alt="">
					<div class="good-info-shop-name">{{ item.shop_name }}</div>
					<img class="good-info-shop-arrow" :src="shopGoodArrow" alt="">
				</div>
			</div> -->

		</div>
	</div>
</template>

<script>
import {
	shopGoodIcon, shopGoodArrow
} from '@/tool/static-img';

export default {
	props: {
		isShop: {
			type: Boolean,
			default: false
		},
		item: {
			type: Object,
			default: {}
		}
	},
	data() {
		return {
			shopGoodIcon, shopGoodArrow
		}
	},
	methods: {
		// 去商品
		handleToItem() {
			localStorage.setItem('goodmsg', 1)
			this.$router.push({
				name: 'good',
				query: {
					id: this.item.id
				}
			})

		},
		// 去店铺
		handleToShop(item) {
			localStorage.setItem('shopInfoName', item.shop_name)
			localStorage.setItem('goodmsg', 1)
			this.$router.push({
				name: 'shopInfo',
				query: {
					id: item.shop_id
				}
			})
		}
	}


}
</script>

<style lang="scss" scoped>
.good-li {
	width: 3.44rem;
	// height: 5.66rem;
	margin-bottom: 0.14rem;
	border-radius: 0.12rem;
	background-color: #ffffff;
	padding-bottom: .14rem;
	&.is-shop {
		// height: 5.16rem;
	}

	.good-li-img {
		display: block;
		width: 3.44rem;
		height: 3.44rem;
		border-radius: 0.12rem 0.12rem 0 0;
	}

	.good-info {
		padding: 0.16rem 0.2rem 0.08rem;

		.good-info-name {
			height: 0.4rem;
			margin-bottom: 0.08rem;
			line-height: 0.4rem;
			font-weight: 500;
			font-size: 0.28rem;
			color: #333333;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			word-break: break-all;
		}

		.good-info-num {
			display: flex;
			align-items: center;
			justify-content: space-between;

			.good-info-price {
				height: 0.44rem;
				line-height: 0.44rem;
				font-weight: 500;
				font-size: 0.32rem;
				color: #FD1A1A;
				display: flex;
				align-items: center;
				justify-content: center;

				.hd_box {
					display: flex;

					span {
						height: .28rem;
						line-height: .3rem;
						color: #FF6200;
						margin-left: .04rem;
						margin-right: .04rem;
					}

					img {
						width: .32rem;
						height: .32rem;
						vertical-align: middle;
						margin-right: .03rem;
					}

					.hd_text {
						height: .32rem;
						color: #FF6200;
						margin-left: .04rem;
						display: flex;
						align-items: center;
						justify-content: center;

					}
				}
			}

			.good-info-sale {
				height: 0.28rem;
				line-height: 0.28rem;
				font-size: 0.2rem;
				font-weight: 400;
				color: #999999;
			}
		}

		.good-info-subsidy {
			// display: flex;
			// height: 0.36rem;
			margin-top: 0.08rem;
			margin-bottom: 0.16rem;
			.good-info-subsidy-btn {
				img {
					width: .32rem;
					height: .32rem;
					// vertical-align: middle;
				}

				width: 100%;
				display: flex;
				margin-top: .08rem;
				// background: url('../../../images/bg_butie.png') no-repeat center;
				// background: #fcf0ef;
				// color: #F32A23;
				// opacity: 0.07;
				background-size: cover;
				align-items: center;
				// justify-content: center;
				height: 0.36rem;
				// padding: 0 0.12rem;
				font-weight: 400;
				font-size: 0.18rem;
				border-radius: 0.06rem;
				text-indent: .04rem;
				box-sizing: border-box;
			}
			.hd_bt{
				background: #fdf4ee;
				color: #FF6200;
			}
		}

		.good-info-shop {
			display: flex;

			.good-info-shop-btn {
				display: flex;
				align-items: center;
				height: 0.36rem;
				padding: 0 0.12rem;
				border-radius: 0.18rem;
				background-color: #F7F7F7;

				.good-info-shop-icon {
					width: 0.24rem;
					height: 0.24rem;
				}

				.good-info-shop-name {
					max-width: 2rem;
					margin-left: 0.08rem;
					font-size: 0.24rem;
					font-weight: 400;
					color: #666666;
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
					word-break: break-all;
				}

				.good-info-shop-arrow {
					width: 0.24rem;
					height: 0.24rem;
				}
			}
		}

	}
}
</style>